<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script th:src="@{/js/jquery-3.6.0.js}"></script>
</head>
<body>
用户名登录
<form id="form">
    <input type="text" name="username" id="username">
    <input type="text" name="password" id="password">
    <button type="button" id="sub">登录</button>
</form>
手机号登录
<form id="formPhone">
    <input type="text" name="phone" id="phone">
    <input type="text" name="password" id="pwd">
    <button type="button" id="subPhone">登录</button>
</form>
</body>

<script th:inline="javascript" type="text/javascript">

    $("#sub").click(function (){

        let user={
            username:$("#username").val(),
            password:$("#password").val()
        }
        console.log(user)
        console.log(JSON.stringify(user))
        $.ajax({
            url:"/user/login",
            method:"post",
            data: JSON.stringify(user),
            contentType: "application/json",
            success: function (res) {
                console.log(res)
                if(res.code){
                    location.href="/chat"//登录成功跳转聊天界面
                    sessionStorage.setItem("user",JSON.stringify(res.data))//用户信息储存到session
                }

            }
        })
    })

    $("#subPhone").click(function (){

        let user={
            phone:$("#phone").val(),
            password:$("#pwd").val()
        }
        $.ajax({
            url:"/user/loginPhone",
            method:"post",
            data: JSON.stringify(user),
            contentType: "application/json",
            success: function (res) {
                console.log(res.data[0].id)
                if(res.code){
                    location.href="/chat"//登录成功跳转聊天界面
                    sessionStorage.setItem("user",JSON.stringify(res.data[0]))//用户信息储存到session
                }

            }
        })
    })

</script>
</html>